<template>
<div class="cover_detail">
<el-button type="primary" class="goback_btn" @click="goback"> 返回 </el-button>
<el-form ref="form" :model="form" label-width="100px" class="thcat_form"  :loading="table_loading" :rules="rules">
  <el-form-item label="id">
    <el-input v-model="form.userId" :disabled="true"></el-input>
  </el-form-item>
   <el-form-item label="头像">
     <img :src="form.avatar"/>
    <!-- <el-input v-model="form.avatar" :disabled="true"></el-input> -->
  </el-form-item>
    <el-form-item label="昵称">
    <el-input v-model="form.nickname" :disabled="form.disabled"></el-input>
  </el-form-item>

    <el-form-item label="性别">
      <el-select v-model="form.gender" placeholder="请选择性别" :value="form.gender">
        <el-option
          label="男"
          value="1">
        </el-option>
         <el-option
          label="女"
          value="2">
        </el-option>
      </el-select>
    <!-- <el-input v-model="gender_t" :disabled="true"></el-input> -->
  </el-form-item>

  <el-form-item label="注册方式">
    <el-input v-model="registration_t" :disabled="form.disabled"></el-input>
  </el-form-item>
  <el-form-item label="星座">
     <el-select v-model="form.constellation" placeholder="请选择星座">
        <el-option
          label="白羊座"
          value="白羊座">
        </el-option>
         <el-option
          label="金牛座"
          value="金牛座">
        </el-option>
         <el-option
          label="双子座"
          value="双子座">
        </el-option>
         <el-option
          label="巨蟹座"
          value="巨蟹座">
        </el-option>
        <el-option
          label="狮子座"
          value="狮子座">
        </el-option>
         <el-option
          label="处女座"
          value="处女座">
        </el-option>
         <el-option
          label="天秤座"
          value="天秤座">
        </el-option>
         <el-option
          label="天蝎座"
          value="天蝎座">
        </el-option>
        <el-option
          label="射手座"
          value="射手座">
        </el-option>
         <el-option
          label="魔羯座"
          value="魔羯座">
        </el-option>
        <el-option
          label="水瓶座"
          value="水瓶座">
        </el-option>
        <el-option
          label="双鱼座"
          value="双鱼座">
        </el-option>
      </el-select>
  </el-form-item>
    <el-form-item label="生日">
    <el-input v-model="form.birthday" :disabled="form.disabled"></el-input>
  </el-form-item>
    <el-form-item label="个性签名">
    <el-input v-model="form.individuality" :disabled="form.disabled"></el-input>
  </el-form-item>
    <el-form-item label="审核状态">
    <el-input v-model="form.approvalStatus" :disabled="form.disabled"></el-input>
  </el-form-item>
    <el-form-item label="国">
    <el-input v-model="form.country" :disabled="form.disabled"></el-input>
  </el-form-item>
    <el-form-item label="省">
    <el-input v-model="form.province" :disabled="form.disabled"></el-input>
  </el-form-item>
    <el-form-item label="市">
    <el-input v-model="form.city" :disabled="form.disabled"></el-input>
  </el-form-item>
    <el-form-item label="区">
    <el-input v-model="form.area" :disabled="form.disabled"></el-input>
  </el-form-item>
    <el-form-item label="qq">
    <el-input v-model="form.qq" :disabled="form.disabled"></el-input>
  </el-form-item>
    <el-form-item label="微信">
    <el-input v-model="form.wechat" :disabled="form.disabled"></el-input>
  </el-form-item>
    <el-form-item label="email">
    <el-input v-model="form.email" :disabled="form.disabled"></el-input>
  </el-form-item>
    <el-form-item label="电话">
    <el-input v-model="form.phone" :disabled="form.disabled"></el-input>
  </el-form-item>
    <el-form-item label="身份">
    <el-input v-model="identity_t" :disabled="form.disabled"></el-input>
  </el-form-item>
    <el-form-item label="账号">
    <el-input v-model="form.username" :disabled="form.disabled"></el-input>
  </el-form-item>
    <el-form-item label="来源" :disabled="true">
       <el-select v-model="form.source" placeholder="请选择性别" :value="form.gender">
        <el-option
          label="H5"
          value="1">
        </el-option>
         <el-option
          label="Android"
          value="2">
        </el-option>
        <el-option
          label="iOS"
          value="3">
        </el-option>
      </el-select>
    <!-- <el-input v-model="source_t" :disabled="false"></el-input> -->
  </el-form-item>
    <el-form-item label="语言">
    <el-input v-model="form.language" :disabled="form.disabled"></el-input>
  </el-form-item>
    <el-form-item label="回收站">
    <el-input v-model="form.recycle_bin" :disabled="form.disabled"></el-input>
  </el-form-item>
    <el-form-item label="状态">
      <el-select v-model="form.status" placeholder="请选择性别" :value="form.gender">
        <el-option
          label="正常"
          value="1">
        </el-option>
         <el-option
          label="禁用"
          value="0">
        </el-option>
      </el-select>
    <!-- <el-input v-model="status_t" :disabled="false"></el-input> -->
  </el-form-item>
    <el-form-item label="平台管理id">
    <el-input v-model="form.platformId" :disabled="true"></el-input>
  </el-form-item>
    <el-form-item label="平台管理名称">
    <el-input v-model="form.platformName" :disabled="true"></el-input>
  </el-form-item>
    <el-form-item label="创建时间">
    <el-input v-model="form.createTime" :disabled="true"></el-input>
  </el-form-item>
   <el-form-item label="更新时间">
    <el-input v-model="form.updateTime" :disabled="true"></el-input>
  </el-form-item>
   <el-form-item label="处理时间">
    <el-input v-model="form.processingTime" :disabled="true"></el-input>
  </el-form-item>
   <el-button type="success" class="goback_btn" @click="upload" v-if="!form.disabled">提交</el-button>
</el-form>
</div>
</template>
<script>
import { editUser, getUserDetail } from '@/api/user/user_m'
import moment from 'moment'
moment.lang('zh-cn')
const log = this.log
export default {
  data() {
    return {
      form: {
        userId: '',
        nickname: '',
        email: '',
        phone: '',
        updateTime: '',
        birthday: '',
        username: '',
        disabled: false
      },
      table_loading: false,
      rules: {
        userId: [
          { required: true, message: '请输入数据', trigger: 'blur' }
        ],
        nickname: [
          { required: true, message: '请输入数据', trigger: 'blur' }
        ],
        email: [
          { required: true, message: '请输入数据', trigger: 'blur', type: 'email' }
        ],
        phone: [
          { required: true, message: '请输入数据', trigger: 'blur' }
        ],
        updateTime: [
          { required: true, message: '请输入数据', trigger: 'blur' }
        ],
        birthday: [
          { required: true, message: '请输入数据', trigger: 'blur' }
        ],
        username: [
          { required: true, message: '请输入数据', trigger: 'blur' }
        ]
      }
    }
  },
  computed: {
    gender_t: function() {
      if (this.form.gender === 1) {
        return '男'
      } else if (this.form.gender === 2) {
        return '女'
      } else {
        return '未知'
      }
    },
    registration_t: function() {
      if (this.form.registration === 1) {
        return '1:短信注册'
      } else {
        return '没有数据'
      }
    },
    status_t: function() {
      if (status === 0) {
        return '禁用'
      } else if (status === 1) {
        return '正常'
      }
    },
    source_t: function() {
      if (this.form.source === 1) {
        return 'H5'
      } else if (this.form.source === 2) {
        return 'Android'
      } else if (this.form.source === 3) {
        return 'iOS'
      }
    },
    identity_t: function() {
      if (this.identity === 1001) {
        return '平台管理员'
      } else if (this.identity === 2001) {
        return '普通用户'
      }
    },
    formateTime_t: function() {
      const temp = new Date(this.form.updateTime).getTime()
      this.form.updateTime = moment(temp).format('MMMM Do YYYY, h:mm:ss a')
      return moment(temp).format('MMMM Do YYYY, h:mm:ss a')
    },
    birthday_t: function() {
      const temp = new Date(this.form.birthday).getTime()
      this.form.birthday = moment(temp).format('MMMM Do YYYY, h:mm:ss a')
      return moment(temp).format('MMMM Do YYYY, h:mm:ss a')
    }
  },
  created() {
    this.table_loading = true
    console.log(JSON.parse(this.$route.query.usermsg))
    const temp = JSON.parse(this.$route.query.usermsg)
    console.log(temp.userId)
    getUserDetail(temp.userId).then((e) => {
      this.form = e.data.user
    }).catch((e) => {

    })
    this.$nextTick(() => {
      const form = JSON.parse(this.$route.query.usermsg)
      // 没有传值 就是edit

      this.$route.query.show ? form.disabled = true : form.disabled = false
      // this.form = form
    })
  },
  methods: {
    onSubmit() {
      console.log('submit!')
    },
    upload() {
      this.$refs['form'].validate(valid => {
        this.table_loading = true
        if (valid) {
          const temp_form = {}
          temp_form.userId = this.form.userId

          // tempData.timestamp = +new Date(tempData.timestamp) // change Thu Nov 30 2017 16:41:05 GMT+0800 (CST) to 1512031311464
          editUser(this.form).then((e) => {
            this.table_loading = false
            this.log(e)
            if (e.data.code === 200) {
              this.$notify({
                title: '成功',
                message: '更新成功',
                type: 'success',
                duration: 2000,
                onClose: () => {
                  // log('onclose))))))))))))))')
                  this.goback()
                }
              })
            } else {
              this.$message.error(e.data.msg)
            }
          }).catch((e) => {
            this.$message.error(e)
            this.table_loading = false
          })
        }
      })
    }
  }
}
</script>
<style lang="scss" scoped>
    .cover_detail{
      width: 100%;
      
    }
    .thcat_form{
      margin-top: 20px;
      width:50%;
    }
</style>
